<template>
	<view>
		<topbar title="通讯录" jt_c="2" background="background:#5EBCA3;color:#fff;"></topbar>
		<view class="content">
			<view style="padding: 0 24rpx;">
				<!-- <view>消息</view> -->
				<view class="top_part dis_f_l_c">
					<u-icon name="email"></u-icon>
					<view style="margin-left: 12rpx;" @click="go_qun">我的群聊</view>
				</view>
			</view>
			<city-select
				placeholder="请输入联系人姓名"
				@cityClick="cityClick"
				:formatName="formatName"
				:obtainCitys="obtainCitys"
				:isSearch="true"
			></city-select>
		</view>
	</view>
</template>

<script>
	import citySelect from '@/components/city-select/city-select.vue';
	import {
	  mapState
	 } from "vuex";
	export default {
		data() {
			return {
				formatName: 'name',
				//显示的通讯录
				obtainCitys: [
					{
						"id": "16008545247",
						"name": "测试名称",
						"src":"https://ask.dcloud.net.cn/account/identicon/e5e619c7efd3311afa1c2f990c7267cd.png",
					}
				]
			};
		},
		components: {
			citySelect
		},
		computed: {
		   ...mapState({
		    isLogin: state => state.isLogin,
		    isSDKReady: state => state.isSDKReady,
		    conversationList: state => state.conversationList,
		   })
		  },
			watch: {
				isSDKReady(val) {
					//isSDKReady == true 请求会话列表
					if (val) {
						this.getConversationList()
					}
				},
				conversationList(val){
					this.getUserInfo(val)
				}
		    },
			
		onLoad() {
			this.get_txl()
		},
		methods: {
			go_qun(){
				this.$.open('/pages/ren_mai/qun')
			},
			cityClick(item) {
				this.go_lt(item.f_uid)
			},
			get_txl(){
				this.$.ajax(1,"post","friend/friend_list",{
						uid:uni.getStorageSync('uid'),
						token: uni.getStorageSync('token'),
				},(res)=>{
					this.obtainCitys = res.data
				})
			},
			//获取消息列表
			getConversationList() {
				// 拉取会话列表
				console.log(111)
				let promise = this.tim.getConversationList();
				promise.then((res) => {
					let conversationList = res.data.conversationList; // 会话列表，用该列表覆盖原有的会话列表
					if (conversationList.length) {
						//将返回的会话列表拼接上 用户的基本资料  
						//说明：如果已经将用户信息 提交到tim服务端了 就不需要再次拼接
						this.$store.commit("updateConversationList", conversationList);
					}
			
				}).catch((err) => {
					console.warn('getConversationList error:', err); // 获取会话列表失败的相关信息
				});
			},
			//根据消息列表请求聊天对象的用户信息 并完成数据拼接
			getUserInfo(conversationList) {
				 this.userAddConversationList = []
				conversationList.forEach(item => {
					let obj = {}
					obj.conversation = item
					userList.forEach(item1 => {
						if (item.toAccount == item1.userId) {
							obj.user = item1
						}
					})
					this.userAddConversationList.push(JSON.parse(JSON.stringify(obj)))
				})
			},
			toRoom(item) {
				this.$store.commit('updateConversationActive', item)
				uni.navigateTo({
					url: './room'
				})
			},
			go_lt(e){
			    let  toUserInfo = {
			     userId:''
			    }
			    toUserInfo.userId = e
			    // this.$store.commit('createConversationActive', e)
			    this.$store.commit('createConversationActive', toUserInfo.userId)
			    console.log(this.$store.state.conversationActive)
			    uni.navigateTo({
			     url: '../guang_chang/chat'
			    })
			   },
		}
	}
</script>

<style lang="scss">
	.content{
		padding-top: calc(var(--status-bar-height) + 124rpx);
	}
	.top_part{
		padding: 12rpx;
	}
</style>
